<template>
	<view class="channelManager">
		<view style="height: 20rpx;"></view>
		<i-scrollList height="100vh" :total="pageData.list.length"
			:pageTotal="pageData.list.length">
			<i-card padding="0rpx 32rpx 0 32rpx">
				<view class="items" v-for="item in pageData.list" :key="item.id" @click="goEdit(item)">
					{{item.channelName}}
				</view>
			</i-card>
		</i-scrollList>
		<view class="flex_bottom" @click="navTo('/pages/business/addChannel', 'navigateTo')">
			<image src="../../static/images/add@2x.png"></image>
			添加渠道
		</view>
	</view>
</template>

<script lang="ts" setup>
	import {
		onShow
	} from '@dcloudio/uni-app'
	import {
		computed,
		reactive,
		ref
	} from 'vue';
	import useStore from '../../stores/index'
	import { getSourceChannelList } from '../../api/business'
	import { navTo } from '../../utils/common';
	const store = useStore()

	const pageData = reactive({
		list: []
	})

	const getPageData = async () => {
		const data = await getSourceChannelList({ tyjPageNum: 1, tyjPageSize: 30 })
		pageData.list = data.rows
	}
	const goEdit = (item : { id : string, channelName : string, sortNum : number }) => {
		navTo(`/pages/business/addChannel?id=${item.id}&channelName=${item.channelName}&sortNum=${item.sortNum}`, 'navigateTo')
	}
	onShow(() => {
		getPageData()
	})
</script>

<style lang="scss" scoped>
	.channelManager {
		width: 100%;
		height: 100vh;
		overflow-y: hidden;
		background-color: $background-color;
		.items {
			@include flexR;
			@include dfont(32rpx);
			height: 120rpx;
			border-bottom: 1rpx solid #f3f4f5;
		}
	}
</style>